<template>
  <div class="wrapper">
    <ul>
      <li>你好1</li>
      <li>你好2</li>
      <li>你好3</li>
      <li>你好4</li>
      <li>你好5</li>
      <li>你好6</li>
      <li>你好7</li>
      <li>你好8</li>
      <li>你好9</li>
      <li>你好10</li>
      <li>你好11</li>
      <li>你好12</li>
      <li>你好13</li>
      <li>你好14</li>
      <li>你好15</li>
      <li>你好16</li>
      <li>你好17</li>
      <li>你好18</li>
      <li>你好19</li>
      <li>你好20</li>
      <li>你好21</li>
      <li>你好22</li>
      <li>你好23</li>
      <li>你好24</li>
      <li>你好25</li>
      <li>你好26</li>
      <li>你好27</li>
      <li>你好28</li>
      <li>你好29</li>
      <li>你好30</li>
      <li>你好31</li>
      <li>你好32</li>
      <li>你好33</li>
      <li>你好34</li>
      <li>你好35</li>
      <li>你好36</li>
      <li>你好37</li>
      <li>你好38</li>
      <li>你好39</li>
      <li>你好40</li>
      <li>你好41</li>
      <li>你好42</li>
      <li>你好43</li>
      <li>你好44</li>
      <li>你好45</li>
      <li>你好46</li>
      <li>你好47</li>
      <li>你好48</li>
      <li>你好49</li>
      <li>你好50</li>
    </ul>
  </div>

</template>

<script>
import BScroll from 'better-scroll'
export default {
  name: "Category",
  data() {
    return {
      scroll: null
    }
  },
  mounted() {
    this.scroll = new BScroll(document.querySelector('.wrapper'),{
      probeType: 3,
      pullUpLoad: true
    })
    this.scroll.on('pullingUp',() => {
      console.log('上拉加载更多');
      this.scroll.finishPullUp()
    })
  }
}
</script>

<style scoped>
  .wrapper{
    height: 150px;
    overflow: hidden;
    background-color: red;
  }
</style>
